<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #box1 {
            border: 1px solid #000;
            padding: 0 20px 20px;
            width: 11em;
        }

        #box1 p {
            word-wrap: normal;
        }

        #box2 {
            border: 1px solid #000;
            padding: 0 20px 20px;
            width: 11em;
        }

        #box2 p {
            word-wrap: break-word;
        }
    </style>
</head>

<body>
    <h2>文本的属性</h2>
    <br>
    <h3>3.长单词换行的方法：word-wrap</h3>
    <br>
    <h4>--->关键字：normal: word-break:normal</h4>
    <p>只在允许的断字点换行（浏览器保持默认处理）</p>
    <div id="box1">
        <p>
            ab cdefgddddsad hhhhhhhhhhsdsdsdhhhhhhhhh afhafahui
            78749844874984+459
            后面是br标签<br>
            这是一段文字。
        </p>
    </div>
    <br>

    <h4>--->关键字：break-word	: word-break:break-word	</h4>
    <p>在长单词或url地址内部进行换行。</p>
    <div id="box2">
        <p>
            ab cdefgddddsad hhhhhhhhhhsdsdsdhhhhhhhhh afhafahui
            7874984+459 www.baidu.com
            后面是br标签<br>
            这是一段文字。
        </p>
    </div>
    <h2>    
        <a href="./目录.html">返回目录</a>
    </h2>
</body>

</html>